<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.2</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="__STATIC__/css/font.css">
    <link rel="stylesheet" href="__STATIC__/css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="__STATIC__/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="__STATIC__/js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style type="text/css">
        /*解决表格出现横向滚动条的bug*/
        .layui-table-body{overflow-x: hidden;}
    </style>
</head>

<body>
<div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a href="">演示</a>
                <a>
                    <cite>导航元素</cite></a>
            </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
    </a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">

                <div class="layui-card-header">
                    <button style="float: right; margin-top: 5px" class="layui-btn" style="float: right" onclick="xadmin.open('添加推送','pushAdd',400,400)"><i class="layui-icon"></i>添加推送</button>
                    <!--<a target="_blank" href="__ADMIN__/push/pushAll" style="float: right" class="layui-btn layui-bg-cyan layui-btn-sm"><i class="layui-icon">&#xe9aa;</i>推送预览</a>-->
                    <div class="layui-input-inline" style="width: 20%;">
                        <input id="searchBox" type="text" placeholder="请输入查找域名" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <button id="search" class="layui-btn" lay-filter="sreach">
                            <i class="layui-icon">&#xe615;</i>
                        </button>
                    </div>
                </div>


                <div class="layui-card-body ">
                    <table class="layui-table layui-form" id="dataTable" lay-filter="dataTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>


<script type="text/html" id="operator">
    <button class="layui-btn layui-btn-xs" lay-event="addLink"><i class="layui-icon">&#xe601;</i>添加链接</button>
    <button class="layui-btn-primary layui-btn layui-btn-xs" lay-event="getLink"><i class="layui-icon">&#xe601;</i>查看链接</button>
    <button class="layui-btn-normal layui-btn layui-btn-xs" lay-event="getPush"><i class="layui-icon">&#xe601;</i>今日推送</button>
</script>

<script type="text/html" id="manager">
    <button class="layui-btn-primary layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</button>
    <button class="layui-btn-danger layui-btn layui-btn-xs" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</button>
</script>

<script>
    var group_id = 0;
    layui.use(['table','form'], function(){
        var table = layui.table,
            form = layui.form;
        //第一个实例
        table.render({
            id:"dataTable",//
            elem: '#dataTable',//指定表格元素
            url: '__ADMIN__/push/pushAjax',  //请求路径
            cellMinWidth: 20 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            //,skin: 'line' //表格风格 line （行边框风格）row （列边框风格）nob （无边框风格）
            //,even: true    //隔行换色
            ,page: true  //开启分页
            ,limit: 15 //每页默认显示的数量
            ,limits: [15,100,1000]  //每页条数的选择项，默认：[10,20,30,40,50,60,70,80,90]。
            ,method:'post'  //提交方式
            ,where: {group_id: group_id}
            ,cols: [[
                {type:'checkbox'}, //开启多选框
                {field: 'id', title: 'ID', width:60,sort:true},
                {field: 'domain', title: '主域名'},
                {field: 'token', title: 'token'},
                {title: '操作', fixed: 'right', width:330, align:'center', toolbar: '#operator'},
                {title: '管理', fixed: 'right', width:180, align:'center', toolbar: '#manager'}
            ]]
        });

        //复选框批量删除操作
        var $ = layui.$, active = {
            getCheckData: function(){ //获取选中数据
                var checkStatus = table.checkStatus('dataTable')
                    ,data = checkStatus.data;//此处未知如何只提取出id
                //异步发送要删除的数据
                $.post('__ADMIN__/push/pushDel',{'data':data},function(code){
                    if(code === '1'){
                        layer.alert("删除成功", {
                            icon: 6
                        });
                        table.reload('dataTable');
                    }else if(code === '0'){
                        layer.msg('删除失败');
                    }
                    else{
                        layer.msg('异常！');
                    }
                });
            }
        };

        $('#delall').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        //搜索重载
        $('#search').on('click', function () {
            // 搜索条件
            var search = $('#searchBox').val();
            table.reload('dataTable', {where: { search: search}});
        });

        //工具条事件监听
        table.on('tool(dataTable)', function (obj)
        { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            var id = data.id;
            var push_ip = data.push_ip;

            if (layEvent === 'edit')
            {
                xadmin.open('域名修改','__ADMIN__/push/pushAdd?id='+id,400,400);
            }

            if (layEvent === 'del')
            {
                layer.confirm('确认要删除吗？',function(index){

                    $.post('__ADMIN__/push/pushDel',{'id':id},function(code){
                        if (code === '1') {
                            tr.remove();
                            layer.msg('已删除!',{icon:1,time:1000});
                        }else{
                            layer.msg('删除失败!',{icon:5,time:1000});
                        }
                    });
                });
            }

            if (layEvent === 'addLink')
            { //添加链接
                xadmin.open('添加链接','__ADMIN__/push/pushLinkAdd?id='+id,400,600);
            }

            if (layEvent === 'getLink')
            { //添加链接
                xadmin.open('查看链接','__ADMIN__/push/pushLinkList?id='+id,400,600);
            }

            if (layEvent === 'getPush')
            { //添加链接
                xadmin.open('今日推送','__ADMIN__/push/pushLinkGet?id='+id,900,800);
            }

        });

    });

</script>
</body>
</html>
